@import "./../../f10-shared/f10-common";

@height: 20px;
@color-blue-rect: #78B7FF;
@color-green-rect: #A5E762;
.shareholder-compare {
  border: 1px solid @color-gray-border;
  margin-bottom: 1rem;
  padding: 0 1rem;
  .display-flex(row);
  .flex;
  div {
    flex: 1;
    -ms-flex: 1;
  }
}

.border-radius(left, @radius: 10px) {
  border-top-left-radius: @radius;
  border-bottom-left-radius: @radius;
}
.border-radius(right, @radius: 10px) {
  border-top-right-radius: @radius;
  border-bottom-right-radius: @radius;
}

.shareholder-left {
  margin-right: 10px;
  ul li {
    .display-flex(row, flex-start);
    margin-bottom: 20px;
  }
  .holder-name {
    line-height: @height;
  }
  .left-radius {
    .border-radius(right);
    background-color: @color-blue-rect;
    height: @height;
    margin-right: 12px;
  }
}

.shareholder-right {
  margin-left: 10px;
  ul li {
    .display-flex(row, flex-start);
    margin-bottom: 20px;
  }
  .holder-name {
    line-height: @height;
  }
  .right-radius {
    .border-radius(right);
    background-color: @color-green-rect;
    height: @height;
    margin-right: 12px;
  }
}